<template>
    <div class="box">
        <van-tabs v-model="active">
            <van-tab title="今日">
                <today />
            </van-tab>
            <van-tab title="全部">
                <all />
            </van-tab>
        </van-tabs>
    </div>
</template>

<script setup >
import { ref } from 'vue'
import all from './ui/all.vue'
import today from './ui/today.vue'

const active = ref(1)
</script>
<style lang='scss' scoped>
:deep(.van-tab) {
    flex: none;
    width: 80px;

}
.box{
    overflow: hidden;
}
:deep(.van-tabs__wrap) {
    position: sticky;
    top: 0;
}

:deep(.van-tab__text) {
    font-size: 20px;
}



:deep(.van-tabs__line) {
    border-radius: 0;
    background-color: #54a7fa;
    height: 10px;
    opacity: .6;
}
</style>